<template>
<div>

<el-card class="box-card">
<div slot="header" class="clearfix">
    <span>创建网格</span>
</div>

<el-form ref="form" :model="form" label-width="180px">

  <el-form-item label="网格名称："  >
    <el-input v-model="form.name" placeholder="请输入接口名称" style="width:400px;"></el-input>
  </el-form-item>

  <el-form-item label="地区：" >
	<el-cascader 
	style="width:400px;"
	:options="districtData"
	:props="props"
	filterable
	change-on-select
	v-model="selectedOptions"
	@change="handleChange">
	</el-cascader>
  </el-form-item>

 

  <el-form-item>
    <el-button type="primary" @click="onSubmit()">立即创建</el-button>
  </el-form-item>

</el-form>

</el-card>

</div>
</template>

<script>

import { mapGetters } from 'vuex'
import District from 'ydui-district/dist/jd_province_city_area_id';

export default {
	
	name : 'createGride',
	
	data () {
		return {
			props : {
				value : 'n',
				label : 'n',
				children : 'c',
			},

			form : {}, 

			districtData : District,


			options: [
				{
		          value: 'zhinan',
		          label: '指南',
		          children: [
			          {
			            value: 'shejiyuanze',
			            label: '设计原则',
			            children: []
			          }
			      ],
			    },
		    ],

		    selectedOptions : [],
		}
	},


	components : {
		
	},

	computed : {
		...mapGetters([
			
		]),
	},

	methods : {
		handleChange () {},

		onSubmit () {
			console.log(this.selectedOptions);
		},
	},

	watch : {
	    
	},

	mounted () {
		console.log(District);
	},

}
</script>

<style scoped>

</style>
